<!--
 * @Date: 2021-11-03 13:26:06
 * @LastEditTime: 2021-11-03 14:02:47
-->
<template>
  <el-dialog :visible.sync="formVisible" center width="783" class="warehouse_add_dialog" @close="handleCancel">
    <div slot="title" class="header_title_box">
      <h2>设置usps账号</h2>
    </div>
    <el-form :ref="formName" :model="formFieldsData" :rules="formRules" label-width="130px">
      <el-row :gutter="59">
        <el-col :span="12">
          <el-form-item label="WebtoolsID" prop="WebtoolsID">
            <el-input v-model="formFieldsData.WebtoolsID" placeholder="请输入WebtoolsID" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="BarcodeMID" prop="BarcodeMID">
            <el-input v-model="formFieldsData.BarcodeMID" placeholder="请输入BarcodeMID" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="MasterMID" prop="MasterMID">
            <el-input v-model="formFieldsData.MasterMID" placeholder="请输入MasterMID" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="eVSpermit" prop="eVSpermit">
            <el-input v-model="formFieldsData.eVSpermit" placeholder="请输入eVSpermit" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="CRID" prop="CRID">
            <el-input v-model="formFieldsData.CRID" placeholder="请输入CRID" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer">
      <el-button type="primary" :loading="btnLoading" @click="handleSubmitSelf">保存</el-button>
      <el-button @click="handleCancel">取消</el-button>
    </span>
  </el-dialog>
</template>
<script>
export default {
  name: 'WarehouseDialog',
  data() {
    return {
      id: '',
      formVisible: false,
      formName: 'warehouse', // 新增仓库formname
      formFieldsData: {
        WebtoolsID: '',
        BarcodeMID: '',
        MasterMID: '',
        eVSpermit: '',
        CRID: ''
      }, // 新增仓库formdata
      department: [], // 所属组织
      btnLoading: false,
      formRules: {
        WebtoolsID: [
          { required: true, message: '请输入WebtoolsID', trigger: 'blur' },
          { max: 200, message: '长度须在200个字符以内', trigger: 'blur' }
        ],
        BarcodeMID: [
          { required: true, message: '请输入BarcodeMID', trigger: 'blur' },
          { max: 200, message: '长度须在200个字符以内', trigger: 'blur' }
        ],
        MasterMID: [
          { required: true, message: '请输入MasterMID', trigger: 'blur' },
          { max: 200, message: '长度须在200个字符以内', trigger: 'blur' }
        ],
        eVSpermit: [
          { required: true, message: '请输入eVSpermit', trigger: 'blur' },
          { max: 200, message: '长度须在200个字符以内', trigger: 'blur' }
        ],
        CRID: [
          { required: true, message: '请输入CRID', trigger: 'blur' },
          { max: 200, message: '长度须在200个字符以内', trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    show(id, item) {
      const vm = this
      if (item && item.WebtoolsID) {
        vm.formFieldsData = item
      } else {
        vm.formFieldsData.WebtoolsID = '' // 仓库id
        vm.formFieldsData.BarcodeMID = '' // 仓库名称
        vm.formFieldsData.MasterMID = '' // 仓库编码
        vm.formFieldsData.eVSpermit = '' // 仓库类型
        vm.formFieldsData.CRID = '' // 上级仓库id
      }
      vm.id = id
      vm.formVisible = true
    },
    /**
     * 清除表单内容
     * */
    clearFormFields() {
      const vm = this
      for (const key in vm.formFieldsData) {
        vm.formFieldsData[key] = ''
      }
    },

    /**
     * 提交表单
     * */
    handleSubmitSelf() {
      const vm = this
      vm.$refs[vm.formName].validate((valid) => {
        if (valid) {
          vm.btnLoading = true
          const params = Object.assign({}, vm.formFieldsData)
          // 实体仓没有上级仓 非实体仓没有所属组织
          if (params.type === 1) {
            params.parent_id = ''
            params.department_id = ''
          }
          vm.addWarehouse(params)
        }
      })
    },

    addWarehouse(params) {
      const vm = this
      const data = JSON.stringify(params)
      vm.$http
        .post(`/warehouse/update-usps-message/${vm.id}`, { usps_json: data })
        .then((res) => {
          vm.$message.success('设置成功')
          vm.handleCancel()
          vm.btnLoading = false
          vm.$emit('submit')
        })
        .catch(() => {
          vm.btnLoading = false
        })
    },
    /**
     * 取消
     * */
    handleCancel() {
      const vm = this
      // vm.$refs[vm.formName].resetFields()
      vm.id = ''
      vm.formVisible = false
    }
  }
}
</script>

<style lang="scss" scoped>
.warehouse_add_dialog {
  .header_title_box {
    margin-bottom: 0;
  }
}
.warehouse_add_dialog ::v-deep .el-dialog__header {
  padding: 16px 16px 24px;
}
.warehouse_add_dialog ::v-deep .el-dialog__body {
  padding: 0 23px 0 16px;
}
.warehouse_add_dialog ::v-deep .el-dialog__footer .el-button + .el-button {
  margin-left: 64px;
}
</style>
